I wrote a website a while ago that is a little messy in how it does things. I used this CSS template and this equal height columns trick. I have not one but two container divs and I can't remember what they're doing. So I'm thinking of re structuring the thing from scratch, and possibly making use of the more "semantic" html5 tags like <nav> and so on at the same time.

The question is: is there a better way to achieve a site structure with these properties:

• 2 equal height main columns (with widths as percentages of the available real estate, not explicitly stated)
• both a header and footer element that stretch the whole width of the total of the two main columns
• That allows the use of semantic html5 tags instead of meaningless divs